import { createSlice, createAsyncThunk } from '@reduxjs/toolkit'
import {
  getBanners,
  getHotRecommend,
  getNewAlbum
} from '@/views/discover/c-views/recommend/service'

export const fetchBannerDataAction = createAsyncThunk(
  'banners',
  async (arg, { dispatch }) => {
    const res = await getBanners()
    dispatch(changeBannerAction(res.banners))
    return res.banners
  }
)

export const fetchHotRecommendSuccessAction = createAsyncThunk(
  'hotRecommend',
  async (arg, { dispatch }) => {
    const res = await getHotRecommend(8)
    dispatch(changeHotRecommendAction(res.result))
  }
)

export const fetchNewAlbumAction = createAsyncThunk(
  'newAlbum',
  async (arg, { dispatch }) => {
    const res = await getNewAlbum()
    dispatch(changeNewAlbumActions(res.albums))
  }
)

interface IRecommendState {
  banners: any[]
  recommend: any[]
  newAlbum: any[]
}

const initialState: IRecommendState = {
  banners: [],
  recommend: [],
  newAlbum: []
}

const recommends = createSlice({
  name: 'recommend',
  initialState,
  reducers: {
    changeBannerAction(state, { payload }) {
      state.banners = payload
    },
    changeHotRecommendAction(state, { payload }) {
      state.recommend = payload
    },
    changeNewAlbumActions(state, { payload }) {
      state.newAlbum = payload
    }
  }
})
export const {
  changeBannerAction,
  changeHotRecommendAction,
  changeNewAlbumActions
} = recommends.actions
export default recommends.reducer
